<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%-- <%@ taglib prefix="c"uri="http://java.sun.com/jstl/core" %> --%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ include file="/common/common.jsp" %>
<html>
<head>
    <meta charset="UTF-8"/>
    <title>商品列表</title>
    <link href="${ctx}/static/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/dist/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/datatables/css/matrix-style.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/dist/css/AdminLTE.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/datatables/css/dataTables.bootstrap.css" rel="stylesheet" type="text/css"/>
    <link href="${ctx}/static/plugins/layer/skin/default/layer.css" rel="stylesheet" type="text/css"/>
    <style>
        button.searching{
            background-color:#666
        }
    </style>
</head>
<body>
<div class="widget-box">
	<div class="widget-title">
	   <h5>请输入查询条件</h5>
	</div>
	<div class="widget-content nopadding">
		<table style="line-height:45px;font-size:12px;">
			<tr>
				<td>&nbsp;&nbsp;&nbsp;供应商：</td>
				<td id="supplierType">
				
				</td>
				<td>&nbsp;&nbsp;&nbsp;商品分类：</td>
				<td id="selectType">
				</td>
				<td id="selectTypeTwo">
				</td>	
				<td id="selectTypeThree">
				</td>	
			</tr>
			<tr>
				<td>&nbsp;&nbsp;&nbsp;商品名称：</td>
				<td><input type="text" class="form-control" name="productName" id="productName"  style="width:200px;" placeholder="商品名称" ></td>
				<td></td>
				<td>
				</td>
				<td>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-success" href="javascript:;" onclick="query();">查 询</a>
				</td>
				<td>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-primary"  onclick="bulkPurchase();"  href="javascript:;">进货</a>
				</td>		
<!-- 				<td> -->
<!-- 					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="btn btn-primary" href="javascript:;">加入购物车</a> -->
<!-- 				</td> -->
				<td>
					&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
				</td>			
			</tr>
		</table>
	</div>
</div>
 <div class="row">
		 <div class="col-xs-12">
		 	<div class="box">
		 		<div class="box-header">
	                 <h3 class="box-title">商品列表</h3>
	             </div>
	             <!-- 列表 -->
	             <div class="box-body table-responsive">
	             	<table id="dataTables" class="table table-bordered table-hover">
	             	</table>
	             </div>
		 	</div>
		 </div>
	</div>
<script src="${ctx}/static/plugins/jQuery/jQuery-2.1.4.min.js"></script>
<script src="${ctx}/static/bootstrap/js/bootstrap.min.js"></script>
<!-- datatable -->
<script src="${ctx}/static/plugins/datatables/jquery.dataTables.js" type="text/javascript"></script>
<script src="${ctx}/static/plugins/datatables/dataTables.bootstrap.js" type="text/javascript"></script>
<script src="${ctx}/static/plugins/layer/layer.js"></script>
<script>
   var tb;
   var classifyLevel = 1;
   $(function () {
		//列表初始化
		tb = $('#dataTables').dataTable({
				"bServerSide": true,
				"destroy": true,//如果需要重新加载的时候请加上这个
				"sPaginationType": "full_numbers",
				"bJQueryUI": true,
				"bAutoWidth": true,//自动宽度
				"bSort": false, //排序功能
				"sDom": '<"">t<"F"ip>',
            "sAjaxSource": "${ctx}/api/countrywideAndLocalProduct/getCountryPageList", //ajax调用接口
				"aoColumnDefs": [{sDefaultContent: '',aTargets: [ '_all' ]}],
	       		"aoColumns": [
						{ "sTitle" : "<input type='checkbox'  id='titleId'/>","mData": "id" ,"class":"sClass","mRender":function(data, type, full){
					  		return "<input type='checkbox'  ref='"+full.productCount+"'  name='checkOne'  value='"+full.id+"' id='id'/>";
	        				}
					  	},
					  	{ "sTitle" : "编号","mData": "id" ,"class":"sClass"},
		                { "sTitle" : "来源","mData": "productForm","class":"sClass","mRender":function(data, type, full){
		                	var text;
	                    	if(full.productForm=='1'){
	                    		text="<font color='blue'>平台</font>";
	                    	}
	                    	else if(full.productForm=='2'){
	                    		text="<font color='green'>代理商</font>";
	                    	}else{
	                    		text="<font color='red'>无</font>";
	                    	}
	                    	return text;
	        				}
		                },
		                { "sTitle" : "供应商","mData": "supplierName","class":"sClass" },
		                { "sTitle" : "商品名称","mData": "productName","class":"sClass" },
		                { "sTitle" : "商品条码","mData": "barCode","class":"sClass" },
		                { "sTitle" : "商品分类","mData": "productClassifyName","class":"sClass" },
		                { "sTitle" : "商品数量","mData": "productCount","class":"sClass" },
		                { "sTitle" : "销量","mData": "productOrderNum","class":"sClass" },
		                { "sTitle" : "参考价","mData": "referencePrice","class":"sClass"},
		                { "sTitle" : "零售价","mData": "retailPrice","class":"sClass" },
		                { "sTitle" : "进货价","mData": "purchasePrice","class":"sClass" },
		                { "sTitle" : "结算价","mData": "settlementPrice","class":"sClass" },
		                {"sTitle" : "操作","mData" : "id", "mRender" : function ( data, type, full ) {
	                	  var text = '<div class="btn-group" style="text-align:left;"><button type="button" class="btn btn-info dropdown-toggle" data-toggle="dropdown">操作 <span class="caret"></span></button>';
							  text = text+'<ul class="dropdown-menu" role="menu">';
							  if(full.productCount!=0){
                                  text += '<li><a href="${ctx}/api/merchantBalanceAccounts/balanceList?ids=' + full.id + ',">进货</a> </li>';
							  }
							  text += '<li class="divider"></li>';
                            text += '<li><a href="${ctx}/api/product/toSeeProductDetails?id=' + full.id + '" >商品详情</a> </li>';
							  text = text + '</ul></div>';
							  return text;
							} 
		                }
	            ],
		        "oLanguage" : {
		           "sProcessing" : "数据加载中······",
		           "sLengthMenu" : "显示 _MENU_ 条记录",
		           "sZeroRecords" : "没有您要搜索的内容！",
		           "sEmptyTable" : "列表中无数据存在！",
		           "sInfo" : "当前显示 _START_ 到 _END_ 条数据，共 _TOTAL_ 条数据",
		           "sInfoEmpty" : "显示 0 到 0 条记录",
		           "sInfoFiltered" : "数据列表中共  _MAX_ 条记录",
		           "oPaginate" : {
		               "sFirst" : "首页",
		               "sPrevious" : "上一页",
		               "sNext" : "下一页",
		               "sLast" : "末页"
		           }
		        },
		        "fnServerData" : function ( sSource, aoData, fnCallback, oSettings ) {
		        	 var classifyLevelNew = null;
			     	   if(!$("#classify"+classifyLevel).val()){
			     		   if(classifyLevel>1)
			     			  classifyLevelNew = classifyLevel -1;
			     	   }else{
			     		  classifyLevelNew = classifyLevel;
			     	   }
					oSettings.jqXHR = $.ajax( {
						"dataType" 	: 'json',
						"type" 		: "GET",
						"async"     : 'false',
						"url" 		: sSource,
						"data" 		: {
							'pageNum': (aoData[3].value/aoData[4].value)+1,
							'pageSize' :  aoData[4].value,
							'productName'  :  $("#productName").val(),
							'productForm'  : "${productForm}",
						'productClassifyId'  :  $("#classify"+classifyLevelNew).val(),
							'createUser': "${createUser}",
							'supplierExtendsId': $("#supplierId").val()
						}, 
						"success"	: fnCallback
					} );
				},
		  });
		classify(0);
		supplier();
		
		$("#titleId").click(function() {
			if (this.checked) {
				$("input[id='id']").each(function() {
					this.checked = true;
				});
			} else {
				$("input[id='id']").each(function() {
					this.checked = false;
				});
			}

		});
		
   });
   
   //条件查询重新加载数据
   function query() {
 	  tb.fnDraw();
   };
   //上架、下架
   function onsal(val){
	   if(confirm("确认上架吗")==true){
  		 $.ajax({
  			 async:false,
       		url:"${ctx}/api/product/onsalPhProduct",
       		data:{
       			id:id,
       			saleNoSaleStatus:val
       		},
       		type:"GET",
       		dataType:"json",
       		success:function(data){
       			if(data.code="200"){
       				tb.fnDraw();
       			}else{
       				alert(data.message);
       			}
       		}
  		 });
  		 return;
  	 }else{
  		 return false;
  	 }
   }
   //删除方法
   function deleteById(id){
	   if(confirm("确认删除吗")==true){
  		 $.ajax({
  			 async:false,
       		url:"${ctx}/api/product/deletePhProduct",
       		data:{custorId:id},
       		type:"GET",
       		dataType:"json",
       		success:function(data){
       			if(data.code="200"){
       				tb.fnDraw();
       			}else{
       				alert(data.message);
       			}
       		}
  		 });
  		 return;
  	 }else{
  		 return false;
  	 }
   }
	//加载类别选项
	var classify=function(val){
		var titleVal = "";
		if(classifyLevel == 1){
			$("#selectTypeTwo").html("");
			$("#selectTypeThree").html("");
		}
		if(classifyLevel == 2){
			$("#selectTypeThree").html("");
		}
		if(val >= 1){
			titleVal = $('#classify'+val).attr("title")
			val = $('#classify'+val).val();
		}
			$.ajax({
				async:false,
				type : "GET",
                url: "${ctx}/api/productClassify/getProductClassifyVoAchildList",
				data:{parentId:val},
				success: function(data) {
					if(data.data){
						var lenth = data.data.length;
						if(lenth>0){
							var select ="";
							select +=" <option value='' >请选择</option> ";
							$.each(data.data, function(i, item){ 
								classifyLevel = item.classifyLevel;
								select += " <option title='"+item.classifyLevel+"' value='"+item.id+"'>"+item.classifyName+"</option> "
							});
							var selectStart =" <select title='"+classifyLevel+"' class='form-control' id='classify"+classifyLevel+"'  style='width:200px;' onchange='classify("+classifyLevel+");'>";
							selectStart += select ;
							selectStart += " </select> ";
							if(classifyLevel == 1){
								$("#selectTypeTwo").html("");
								$("#selectTypeThree").html("");
								$("#selectType").html(selectStart);
							}
							if(classifyLevel == 2){
								$("#selectTypeThree").html("");
								$("#selectTypeTwo").html(selectStart);
							}
							if(classifyLevel == 3){
								$("#selectTypeThree").html(selectStart);
							}
						}else{
							if(titleVal == 1){
								$("#selectTypeTwo").html("");
								$("#selectTypeThree").html("");
							}
							if(titleVal == 2){
								$("#selectTypeThree").html("");
								if(!val){
									$("#selectTypeTwo").html("");
								}
							}
							if(titleVal == 3){
								if(!val){
									$("#selectTypeThree").html("");
								}
							}
						}
					}else{
						if(titleVal == 1){
							$("#selectTypeTwo").html("");
							$("#selectTypeThree").html("");
						}
						if(titleVal == 2){
							classifyLevel = titleVal-1;
							$("#selectTypeThree").html("");
							if(!val){
								$("#selectTypeTwo").html("");
							}
						}
						if(titleVal == 3){
							classifyLevel = titleVal-1;
							if(!val){
								$("#selectTypeThree").html("");
							}
						}
					}
				}
			});
};
//加载类别选项
var supplier=function(){
		$.ajax({
			async:false,
			type : "GET",
            url: "${ctx}/api/supplier/list",
			success: function(data) {
				if(data.data){
						var select =" <select  class='form-control' id='supplierId'  style='width:200px;'> <option value='' >请选择</option>";
						$.each(data.data, function(i, item){ 
							select += " <option  value='"+item.id+"'>"+item.supplierName+"</option> "
						});
						$("#supplierType").append(select);
				}else{
				}
			}
		});
};
		//进货按钮调用方法
		function  bulkPurchase(){
			 var num=$("input[type='checkbox'][name='checkOne']:checked").length;
			  if (num == 0) {
				layer.alert('请至少选择一种商品', {icon: 2}); 
				return false;
			}
			  if(!ckeckProductCount()){
				  return false;
			  }
			  var  Ids = "";
			$("input[type='checkbox'][name='checkOne']:checked").each(function(index){
				Ids += $(this).val() + ",";
			  });
// 			alert(Ids);
			window.location.href="/api/merchantBalanceAccounts/balanceList?ids="+Ids;
		}
		//校验商品数量为零
		function  ckeckProductCount(){
			var isGo=true;
			$("input[type='checkbox'][name='checkOne']:checked").each(function(){
				 var count=$(this).attr("ref");
				 var id=$(this).val();
				 console.log(id);
				 console.log(count);
				 if(count=="0"){
						layer.alert('编号为'+id+'的商品数量为0，请重新选择', {icon: 2}); 
						isGo=false;
						return isGo;
				 }
			  });
			return isGo;
		}

</script>
</body>
</html>